import {
  createRouter,
  createWebHashHistory,
  createWebHistory,
} from "vue-router";
import Films from "../views/Films.vue";
// import Cinemas from "../views/Cinemas.vue";
// import Center from "../views/Center.vue";
import NotFound from "../views/NotFound.vue";
import Nowplaying from "../views/films/Nowplaying.vue";
import Comingsoon from "../views/films/Comingsoon.vue";
import Detail from "../views/Detail.vue";
import Login from "../views/Login.vue";

const routes = [
  {
    path: "/",
    redirect: "/films", //重定向-方式一：路径
    // redirect: {
    //   name: "myfilms", //重定向-方式二：name;这种方式存在两个及以上的重定向就不生效，建议用方式一
    // },
  },
  {
    path: "/login",
    component: Login,
    name: "Login",
  },
  {
    path: "/films",
    name: "myfilms", //命名路由
    component: Films,
    children: [
      //嵌套路由
      {
        path: "/films/nowplaying",
        component: Nowplaying,
      },
      {
        path: "comingsoon", //第二种写法，注意前面不要加/
        component: Comingsoon,
      },
      {
        path: "/films",
        redirect: "/films/nowplaying",
      },
    ],
  },
  //配置detail
  //第一类-params类型：/detail/456
  {
    path: "/detail/:myid",
    component: Detail,
    name: "Detail",
  },
  //第二类-query类型：/detail?myid=456
  // {
  //   path: "/detail",
  //   component: Detail,
  // },

  {
    path: "/cinemas",
    component: () => import("../views/Cinemas.vue"), //懒加载方式
  },
  {
    path: "/center",
    alias: "/wode", //别名
    component: () => import("../views/Center.vue"), //懒加载方式
    meta: {
      requiredAuth: true,
    },
  },
  {
    path: "/:pathMatch(.*)*",
    component: NotFound,
  },
];

const router = createRouter({
  //模式一：hash模式
  // history: createWebHashHistory(),
  //模式二：history模式
  history: createWebHistory(),
  routes,
});

//全局拦截
// 支持async、await
// router.beforeEach(async (to, from, next) => {
//   let isAuthenticated = await localStorage.getItem("token");
//   // if (to.name !== "Login" && !isAuthenticated && to.fullPath === "/center")
//   //   next({ name: "Login" });
//   // else next();

//   //某几个页面授权，可以加上meta标签
//   if (to.name !== "Login" && !isAuthenticated && to.meta.requiredAuth)
//     next({ name: "Login" });
//   else next();
// });

// router.afterEach((to, from) => {
//   console.log("收集用户行为信息");
// });

export default router;
